<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="../ucs.css">
    <link rel="stylesheet" href="../demo.css">
</head>
<body>
    <div id="main"></div>
    <script type="text/javascript" src="../../dist/libs/u-eventhub.js"></script>
    <script type="text/javascript" src="../../dist/libs/engine.js"></script>
    <script type="text/javascript" src="../../dist/ucsmy-ui.js"></script>

    <script>
        var phoneDM = new UDM({
            label:"<span>*</span> 手机号：",
            placeholder:"请输入您的手机号",
            validator:[
                {type:"require",msg:"手机号码不能为空"},
                {type:"mobile",msg:"手机号码格式错误，请重新输入"}
            ]
        });
        var imgCodeDM = new UDM({
            label:"<span>*</span> 图形验证码：",
            placeholder:"请输入图形验证码",
            validator:[
                {type:"require",msg:"图形验证码不能为空"}
            ]
        });
        var imgBtnDM = new UDM({
            value:"../images/code.jpg",
            onClick:function(){
                imgBtnDM.setValue("../images/logoe.jpg");
            }
        });

        /**
         * fn(v)：v是输入框中的value*/
        var msgCodeDM = new UDM({
            label:"<span>*</span> 短信验证码：",
            placeholder:"请输入短信验证码",
            validator:[
                {type:"require",msg:"验证码不能为空"},
                {
                    type:"fn",
                    fn:function(v) {

                    }
                }
            ]
        });

        /**
         * @desc
         * onClick()：
         * count：倒计时秒数*/
        var msgBtnDM = new UDM({
            count:5,
            onClick:function(){
                if(phoneDM.validate() && imgCodeDM.validate()){
                    console.log('倒计时')
                    UEventHub.emit('getcode',true);
                }else{
                    console.log('验证没通过')
                }
            }
        });

        /**
         * @desc
         * onClick()：
         *      UEventHub.emit('next','step1');  判断通过后添加发布事件,'step1'：当前第几步
         */
        var btnNext1DM = new UDM({
            onClick:function(){
                console.log('btnNext1');
                UEventHub.emit('next','step1');
            }
        });

        /**
         * 第二步
         * */
        var step2pwdDM = new UDM({
            label:"<span>*</span> 新密码：",
            placeholder:"密码为6-16位字母、数字的组合",
            validator:[
                {type:"require",msg:"密码不能为空"},
                {
                    type:"fn",
                    fn:function(v){
                        console.log(v);
                        return false;
                    },
                    msg:"密码必须为6-16位字母、数字的组合"}
            ]
        });
        var step2newPwdDM = new UDM({
            label:"<span>*</span> 确认密码：",
            placeholder:"请再次输入新密码",
            validator:[
                {type:"require",msg:"密码不能为空"},
                {
                    type:"fn",
                    fn:function(v){
                        if(v == step2pwdDM.getValue()){
                            return true;
                        }else{
                            return false;
                        }
                    },
                    msg:"两次密码输入不一致"
                }
            ]
        });

        /**
         * @desc btnNext2DM 重置密码中下一步按钮
         * onClick()：
         */
        var btnNext2DM = new UDM({
            onClick:function(){
                console.log('btnNext2');
                UEventHub.emit('next','step2');
            }
        });

        /**
        * 页面链接
         */
        var URLDM = new UDM({
            home:"../demoIndex/index.html"  //返回首页
        });

        var PageDM = {
            URL:URLDM,
            phone:phoneDM,
            imgCode:imgCodeDM,
            imgBtn:imgBtnDM,
            msgCode:msgCodeDM,
            msgBtn:msgBtnDM,
            btnNext1:btnNext1DM,
            btnNext2:btnNext2DM,
            step2pwd:step2pwdDM,
            step2newPwd:step2newPwdDM
        }
    </script>
</body>
</html>